<template>
  <tr>
    <td>
      <input type="checkbox" v-model="obj.checked" />
    </td>
    <td>
      <span>{{ obj.name }}</span>
    </td>
    <td>
      <span>{{ obj.price }}</span>
    </td>
    <td>
      <!-- 给-按钮绑定点击事件 -->
      <button @click="subFn" :disabled="this.obj.num == 1">-</button>
      <span>{{ obj.num }}</span>
      <!-- 给+按钮绑定点击事件 -->
      <button @click="addFn">+</button>
    </td>
    <td>
      <span>{{ obj.num * obj.price }}</span>
    </td>
    <td>
      <!-- 给删除按钮绑定点击事件 -->
      <button @click="delFn">删除</button>
    </td>
  </tr>
</template>

<script>
export default {
  props: ["obj", "index"],
  methods: {
    addFn() {
      this.obj.num++;
    },
    subFn() {
      this.obj.num--;
    },
    delFn() {
      this.$emit("del", this.index);
    },
  },
};
</script>

<style>
</style>